<template>
  <div class="zoom">
     <el-header>
       <!-- <el-row class=""> -->
        <!-- <el-col :span="3"></el-col> -->
        <!-- <el-image :src="require('@/assets/images/newlogo1.jpg')"></el-image> -->
       
          
        <!-- <div class="logo">.</div> -->
       <center><div class="titlefont">广陵多能流分层调控系统 </div></center>
       
       
          
       <!-- </el-row> -->
        <el-row :gutter="0" class="el-row1">
          <el-col :span="4">
             <el-image :src="require('@/assets/images/newlogo3.jpg')"></el-image>
          </el-col>
          <el-col :span="2">.</el-col>
          <el-col :span="18">
            <el-row>
              <el-col :span="17">
                <el-menu
                  :default-active="activeIndex+' '"
                  class="el-menu-demo"
                  mode="horizontal"
                 
                  background-color="#005B5C"
                  text-color="#fff"
                  active-text-color="#ffd04b"
                >
                  <el-menu-item index="1" @click="routertoinfo()"
                    ><font color="white" class="fontnav">首页 </font></el-menu-item
                  >
                  <el-submenu index="2">
                    <template slot="title"
                      ><font color="white" class="fontnav">系统总览</font></template
                    >
                    <el-menu-item
                      index="2-1"
                      @click="routertosystemstructure()"
                      ><font color="white">系统结构</font></el-menu-item
                    >
                    <el-menu-item index="2-2" @click="routertoCharactInfo()"
                      ><font color="white">功率曲线</font></el-menu-item
                    >
                    <el-menu-item index="2-3" @click="routertoOperaInfo()"
                      ><font color="white">运行参数</font></el-menu-item
                    >

                    <el-menu-item index="2-5" @click="routertopoweranalysis()"
                      ><font color="white">电量分析</font></el-menu-item
                    >
                    <el-menu-item index="2-6" @click="routertonetcharactinfo()"
                      ><font color="white">环境检测</font></el-menu-item
                    >
                    <el-menu-item index="2-7" @click="routertonetoperainfo()"
                      ><font color="white">系统工况</font></el-menu-item
                    >
                    <el-menu-item index="2-8" @click="routertoweather()"
                      ><font color="white">告警管理 </font></el-menu-item
                    >
                     <el-menu-item index="2-8" @click="routertoEquipmentbasicdata()"
                      ><font color="white">拓扑编辑 </font></el-menu-item
                    >
                  </el-submenu>

                  <el-submenu index="3">
                    <template slot="title"
                      ><font color="white" class="fontnav">运行监控</font></template
                    >
                    <!-- <el-submenu index="3-1">
                      <template slot="title"
                        ><font color="white">运行控制</font></template
                      > -->
                       <el-menu-item index="3-1-0" @click="routertoruncontroller()"
                        ><font color="white">运行控制</font></el-menu-item
                      >
                      <el-menu-item index="3-1-1" @click=" routertopcc()"
                        ><font color="white">微网PC</font></el-menu-item
                      >
                       <el-submenu index="3-1-2">
      <template slot="title" ><font color="white">分布式能源</font></template>
      <el-menu-item index="2-4-1" @click="routertowindpowersystem()"><font color="white">风电系统</font></el-menu-item>
      <el-menu-item index="2-4-2" @click="routertopvsystem()"><font color="white">光伏系统</font></el-menu-item>
      <el-menu-item index="2-4-3" @click=" routertodieselsystem()"><font color="white">三联供</font></el-menu-item>
    </el-submenu>
                      
                      <el-menu-item index="3-1-3" @click="routertostoragesystem()"
                        ><font color="white" >储能系统</font></el-menu-item
                      >
                      <el-menu-item index="3-1-4" @click="routertoloadsystem()"
                        ><font color="white">负荷系统</font></el-menu-item
                      >
                      <el-menu-item index="3-1-4"
                        ><font color="white">远控操作</font></el-menu-item
                      >
                      <el-menu-item index="3-1-4" @click="routertomonitoring()"
                        ><font color="white">计量监测</font></el-menu-item
                      >
                      <el-menu-item index="3-1-4"
                        ><font color="white">运行模式</font></el-menu-item
                      >
                    </el-submenu>
                  </el-submenu>
                  <el-submenu index="4">
                    <template slot="title"
                      ><font color="white" class="fontnav">能量管理</font></template
                    >
                    <el-menu-item index="4-1" @click="routertopowerforecasting()"
                      ><font color="white">发电预测</font></el-menu-item
                    >
                     <el-submenu index="4-2">
                        <template slot="title" ><font color="white">分布式能源管理</font></template>
                        <el-menu-item index="4-2-1" @click=" routertofuelmanagement()"><font color="white">燃料管理</font></el-menu-item>
                        <el-menu-item index="4-2-3" @click="routertostateofrepair()"><font color="white">检修状态管理</font></el-menu-item>
                        <el-menu-item index="4-2-4" @click=" routertonuclearpowerstate()"><font color="white">核电状态管理</font></el-menu-item>
                        <el-menu-item index="4-2-5" @click=" routertopowermanagement()"><font color="white">主电源管理</font></el-menu-item>
                     </el-submenu>
                   <el-submenu index="4-3">
                      <template slot="title" ><font color="white">负荷管理</font></template>
                      <el-menu-item index="4-3-1" @click=" routertoloadclassmanagement()"><font color="white">负荷分类管理</font></el-menu-item>
                     <el-menu-item index="4-3-2" @click=" routertoloadmanagement()"><font color="white">负荷用电管理</font></el-menu-item>
                   </el-submenu>
                    <el-menu-item index="4-2" @click="routertonetworkReport()"
                      ><font color="white">需量控制</font></el-menu-item
                    >
                    <el-menu-item index="4-2" @click="routertopowergenerationplan()"
                      ><font color="white">发用能计划</font></el-menu-item
                    >
                  </el-submenu>

                  <el-submenu index="5">
                    <template slot="title"
                      ><font color="white" class="fontnav">综合分析</font></template
                    >
                    <el-menu-item index="5-1" @click="routertosampling()"
                      ><font color="white">能效统计分析</font></el-menu-item
                    >
                    <el-menu-item index="5-2" @click="routertodecision()"
                      ><font color="white">能效分析</font></el-menu-item
                    >
                    <el-menu-item index="5-3" @click="routertodiscuss()"
                      ><font color="white">智慧用能服务管理</font></el-menu-item
                    >
                  </el-submenu>
                  <el-submenu index="6">
                    <template slot="title"
                      ><font color="white" class="fontnav">系统管理</font></template
                    >
                    <el-menu-item index="6-1" @click=" routertodatacollection()"
                      ><font color="white">数据采集</font></el-menu-item
                    >
                    <el-menu-item index="6-1" @click=" routertodatacollection()"
                      ><font color="white">数据分析</font></el-menu-item
                    >
                    <el-menu-item index="6-2" @click="routertodecision()"
                      ><font color="white">权限管理</font></el-menu-item
                    >
                    <el-menu-item index="6-3" @click="routertodiscuss()"
                      ><font color="white">曲线工具</font></el-menu-item
                    >
                    <el-menu-item index="6-4" 
                      ><nuxt-link to="/report"><font color="white">报表管理</font></nuxt-link></el-menu-item
                    >
                  </el-submenu>
                </el-menu>
              </el-col>
              <el-col :span="4">.</el-col>
              <el-col :span="3">
                <el-menu
                 
                  class="el-menu-demo"
                  mode="horizontal"
                  @select="handleSelect"
                  background-color="#005B5C"
                  text-color="#fff"
                  active-text-color="#ffd04b"
                >
                  <el-menu-item index="2"
                    ><font color="white">退出</font></el-menu-item
                  >
                  <el-menu-item index="2"
                    ><font color="white">注销</font></el-menu-item
                  >
                </el-menu>
              </el-col>
            </el-row>
          </el-col>
           
        </el-row>
        <!-- <el-divider></el-divider> -->
      </el-header>
      
  </div>
</template>

<script >
export default {
  data() {
    return {
       activeIndex: "1",

      activeName: 'first',
    }
  },
 

  props: {
    props: {
      type: Object,
      require: true
    }
  },
  methods: {
     handleSelect(key, keyPath) {
      console.log(key, keyPath)
    },
     opencarinfo(item) {
      //  this.$router.push({name:'details',params: {id:'1'}})
      // alert("执行")

      this.$router.push({ path: '/details', query: { id: item.device_id } })
    },
     routertoruncontroller() {
      this.$router.push({ path: '/runcontroller' })
    },
    routertoinfo() {
      this.$router.push({ path: '/home' })
    },
    routertoindex2() {
      this.$router.push({ path: '/indexx' })
    },
    routertoEquipmentbasicdata() {
      this.$router.push({ path: '/workspace' })
    },
    routertoCharactInfo() {
      this.$router.push({ path: '/powercurve' })
    },
    //  运维信息
    routertoOperaInfo() {
      this.$router.push({ path: '/operationparameters' })
    },
    //  networkdata
    routertosystemstructure() {
      this.$router.push({ path: '/systemstructure' })
    },
    //  weather
    routertoweather() {
      this.$router.push({ path: '/workspacecopy' })
    },
    //  netcharactinfo
    routertonetcharactinfo() {
      this.$router.push({ path: '/environmentalmonitoring' })
    },
    //netoperainfo
    routertonetoperainfo() {
      this.$router.push({ path: '/systemoperatingmode' })
    },

    routertoequipmentReport() {
      this.$router.push({ path: '/equipmentreport' })
    },
    routertonetworkReport() {
      this.$router.push({ path: '/networkreport' })
    },

    routertoauthority() {
      this.$router.push({ path: '/authority' })
    },
    routertodatainterface() {
      this.$router.push({ path: '/datainterface' })
    },
    routertodataprepro() {
      this.$router.push({ path: '/dataprepro' })
    },
    routertodecision() {
      this.$router.push({ path: '/decision' })
    },
    routertodiscuss() {
      this.$router.push({ path: '/discuss' })
    },
    routertomodelmanager() {
      this.$router.push({ path: '/modelmanager' })
    },
    routertosampling() {
      this.$router.push({ path: '/sampling' })
    },
    routertopcc(){
        this.$router.push({ path: '/pcc' })
    },
    routertowindpowersystem(){
      this.$router.push({ path: '/windpowersystem' })
    },
    routertopvsystem(){
      this.$router.push({ path: '/pvsystem' })
    },
    routertodieselsystem(){
      this.$router.push({ path: '/dieselsystem' })
    },
     routertostoragesystem(){
      this.$router.push({ path: '/storagesystem' })
    },
     routertoloadsystem(){
      this.$router.push({ path: '/loadsystem' })
    },
     routertomonitoring(){
      this.$router.push({ path: '/monitoring' })
    },
    routertopowerforecasting(){
      this.$router.push({ path: '/powerforecasting' })
    },
    routertodatacollection(){
      this.$router.push({ path: '/datacollection' })
    },
     routertofuelmanagement(){
      this.$router.push({ path: '/fuelmanagement' })
    },
    routertostateofrepair(){
      this.$router.push({ path: '/stateofrepair' })
    },
     routertonuclearpowerstate(){
      this.$router.push({ path: '/nuclearpowerstate' })
    },
     routertopowermanagement(){
      this.$router.push({ path: '/powermanagement' })
    },
    routertoloadmanagement(){
      this.$router.push({ path: '/loadmanagement' })
    },
    routertoloadclassmanagement(){
      this.$router.push({ path: '/loadclassmanagement' })
    },
     routertopowergenerationplan(){
      this.$router.push({ path: '/powergenerationplan' })
    },
     routertopoweranalysis(){
      this.$router.push({ path: '/poweranalysis' })
    },
  }
}
</script>

<style lang="scss" scoped>
.zoom{
 
}
.fontnav{
  font-size:large;
 
}
// .el-header {
//   // background-color:#015659;
//   background-color:#005B5C;
  
//   // display: flex;
//   align-items: center;
//   height:9%;
//   margin-bottom:5%;
//   padding-left:0px;
//   padding-right:0px;
// }
// .homelogo{
  
//   width:400px;
//   height:101px;
//    background-image: url(../assets/images/newlogo.jpg);
//    border-radius:0px;
//    background-size:100%;
//    	// display:inline;
   
// }
.titlefont{
  align:center;
  	// display:inline;
  margin-top:0.74%;
  // margin-left:600px;
        color: #F5F4F5;
        font-size:25px;
letter-spacing: 2px;
text-shadow: 0px 1px 0px #999, 0px 2px 0px #888, 0px 3px 0px #777, 0px 4px 0px #666, 0px 5px 0px #555, 0px 6px 0px #444, 0px 7px 0px #333, 0px 8px 7px #001135;
 }

// .star {
//   display: block;
//   color: #f60 !important;
//   text-decoration: underline;
//   margin-bottom: 0.1rem;
// }
.el-menu.el-menu--horizontal {
    // border-bottom: solid 0px #e6e6e6;
    border-bottom: solid 1px #256768;
}
// .title {
//   color: #0d1a26;
//   font-weight: 600;
//   padding: 0.05rem 0.15rem;
//   border-bottom: 1px solid #ccc;
// }

// .group {
//   margin: 0.1rem 0 0.2rem 0.3rem;
//   padding: 0;

//   a,
//   li {
//     line-height: 2;
//   }

//   li {
//     list-style: initial;
//   }
// }

// .bottom {
//   position: absolute;
//   bottom: 0.1rem;
// }

// .items {
//   padding: 0.05rem 0.15rem;

//   .el-input-number {
//     width: initial;
//     line-height: 0.32rem;

//     .el-input__inner {
//       padding-left: 0;
//       height: 0.34rem;
//       line-height: 0.34rem;
//     }

//     .el-input-number__increase {
//       line-height: 0.16rem;
//     }
//   }
// }

// .formItem {
//   margin-bottom: 0.1rem;
// }
.el-row1{
  background-color:#005B5C;
  margin-left:0px;
  margin-right:0px;
}


</style>
